@mixin flex-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 26rpx;
}

.healthContent {
  width: 100vw;
  height: auto;
  background: white;
  box-sizing: border-box;
  padding: 32rpx;

  .healthCard {
    width: 100%;
    height: 600rpx;
    background: white; // 可选：为卡片添加背景色
    box-shadow: 0 0 16rpx rgba(0, 0, 0, 0.2); // 添加立体阴影，上下左右相同
    border-radius: 16rpx; // 添加圆角边框
    position: relative;
    margin-bottom: 32rpx;
    .picuser {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      height: 400rpx;
      width: 250rpx;
    }

    .leftInfo {
      position: absolute;
      height: 400rpx;
      width: 190rpx;

      left: 20rpx;
      top: 50%;
      transform: translateY(-50%);
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      align-items: center;
      .top {
        flex: 1;
        box-sizing: border-box;
        border-bottom: 2rpx solid lightgray;
        width: 100%;
        @include flex-center;
        view {
          &:last-child {
            margin-top: 24rpx;
          }
        }
      }
      .bottom {
        flex: 1;
        box-sizing: border-box;
        width: 100%;
        @include flex-center;  view{
            &:last-child{
                margin-top: 24rpx;
            }
        }
      }
    }

    .rightInfo {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      right: 20rpx;
      height: 400rpx;
      width: 190rpx;

      display: flex;
      flex-direction: column;
      justify-content: space-between;
      align-items: center;
      .top {
        flex: 1;
        box-sizing: border-box;
        border-bottom: 2rpx solid lightgray;
        width: 100%;
        @include flex-center;
        view {
          &:last-child {
            margin-top: 24rpx;
          }
        }
      }
      .bottom {
        flex: 1;
        box-sizing: border-box;
        width: 100%;
        @include flex-center;  view{
            &:last-child{
                margin-top: 24rpx;
            }
        }
      }
    }
  }
}
